<template>
	<view class="container">
		<scroll-view class="scroll_view" scroll-y="true" scroll-with-animation="true">
			<view class="item_content" v-for="(video,index) in video_list" :index="index" :key="index">
				<view class="item_image_box">
					<view class="item_image">
						<image class="item_corver" mode="aspectFill" :src="video.r_image"> </image>
						<image class="item_play" src="/static/image/bf.png" @click="itemclick(video)"></image>
					</view>
					<text class="item_time">{{video.r_times | formatTime}}</text>
				</view>

				<view class="item_text">
					<text class="item_title">{{video.r_title}}</text>
					<text class="item_desc">{{video.r_tag | formatTag}} </text>
				</view>

			</view>

			<uni-section title="" type="line" v-show="video_list.length>3">
				<uni-load-more iconType="auto" :status="status" />
			</uni-section>
		</scroll-view>
	</view>
</template>

<script>
	import api from './study.js'
	export default {
		data() {
			return {
				video_list: [],
				page: 1,
				status: 'more',
			}
		},
		onReady() {
			this.getVideoList();
		},
		onLoad() {
			this.share.path = '/pages/study/study';
			uni.showShareMenu({
				withShareTicket: true,
				menus: ["shareAppMessage", "shareTimeline"]
			})
		},
		onReachBottom() {
			this.loadMore();
		},
		methods: {
			itemclick(video) {
				uni.navigateTo({
					url: '/pages/video/video?video=' + encodeURIComponent(JSON.stringify(video))
				})
			},
			loadMore() {
				if (this.video_list.length == this.page * 10) {
					this.page++;
					this.getVideoList();
				}
			},
			async getVideoList() {
				this.status = 'loading';
				let res = await api.getResourcelist(this.page);
				if (res.data.errcode == "0") {
					let data_list = res.data.data.list;
					this.video_list = [...this.video_list, ...data_list];
				} else {
					uni.showToast({
						title: '数据错误',
						icon: 'none',
						duration: 2000
					});
				}
				if (this.video_list == 10 * this.page) {
					this.status = 'more';
				} else {
					this.status = 'no-more';
				}
			},
		},
		//时间戳的处理    
		filters: {
			formatTime: function(value) {
				if (value < 60) {
					if (value < 10) {
						return "0:0" + value;
					} else {
						return "0:" + value;
					}
				} else {
					var s = value % 60;
					if (s < 10) {
						s = "0" + s;
					}
					return parseInt(value / 60) + ":" + s;
				}
				//return value;
			},
			formatTag: function(value) {
				return value.replaceAll("┆", "  ")
			}
		},
	}
</script>

<style lang="scss">
	//@import "@/common/title_bar.css";
	@import "./study.scss";
</style>
